<template>
	<view class="radio-button-container">
		<view class="tabs-btn" v-for="(item,index) in list" :key="index" @click="usdtTypeChange(item)"
			:class="`${check===item[value]?'is-active':''}`">
			<!-- @click="usdtTypeChange('ERC-20')" :class="`${check==='ERC-20'?'is-active':''}`" -->
			{{item[label]}}
		</view>
	</view>
</template>

<script>
	export default {
		name: "radioButton",
		props: {
			check: {
				type: String,
				default: ''
			},
			list: {
				default: () => [],
				type: Array
			},
			// 显示的文字的键
			label: {
				type: String,
				default: ''
			},
			// 返回的键
			value: {
				type: String,
				default: ''
			},
		},
		data() {
			return {

			};
		},
		methods: {
			// 类型修改
			usdtTypeChange(item) {
				if (this.check === item[this.value]) {
					return
				} else {
					this.$emit('update:check', item[this.value])
					this.$emit('change', item)
				}
			},
		}
	}
</script>

<style lang="scss" scoped>
	.radio-button-container {
		display: flex;
		width: fit-content;
		>view {
			padding: 0 40rpx;
			height: 64rpx;
			text-align: center;
			line-height: 64rpx;
			color: rgba(182, 182, 182, 1);
			font-size: 28rpx;
			letter-spacing: 1rpx;
			border-radius: 4px;
			border: 1px solid rgba(182, 182, 182, 1);
			box-sizing: border-box;
			background: rgba(255, 255, 255, 1);
			&.is-active {
			color: rgba(41, 52, 208, 1);
			border: 1px solid rgba(41, 52, 208, 1);
			background: rgba(41, 52, 208, 0.05);
			}
		}
	}
</style>
